<script setup>

</script>

<template>
  <div>
  <h1>这是按钮组件的学习</h1>
  <div>
    <el-button type = "primary">主按键</el-button>
    <el-button type = "success">成功按键</el-button>
    <el-button type = "info">信息按键</el-button>
    <el-button type = "danger">危险按键</el-button>
    <el-button type = "warning">警告按键</el-button>
  </div>
    <h1>朴素按键</h1>
    <div>

      <el-button plain type = "primary">主按键</el-button>
      <el-button plain type = "success">成功按键</el-button>
      <el-button plain type = "info">信息按键</el-button>
      <el-button plain type = "danger">危险按键</el-button>
      <el-button plain type = "warning">警告按键</el-button>

    </div>
    <h1>
      不同尺寸的按键
    </h1>
    <div>
      <el-button type = "primary">主按键</el-button>
      <el-button size = medium type = "success">成功按键</el-button>
      <el-button size = small type = "info">信息按键</el-button>
      <el-button size = mini type = "danger">危险按键</el-button>
      <el-button type = "warning">警告按键</el-button>
    </div>
    <h1>
      圆角
    </h1>
    <div>
      <el-button round type = "primary">主按键</el-button>
    </div>
    <h1>
      带图标的按键
    </h1>
    <div>
      <el-button icon = "el-icon-phone" type ="primary">接听</el-button>

    </div>
  </div>
</template>

<style scoped>

</style>